<template>

  <t-layout>
    <t-header class="header">
      <t-head-menu theme="light">
        <template #logo>
          <t-icon name="system-components" size="32" />
          <h3>StarIT AI</h3>
        </template>
        <t-menu-item v-for="menu in menus" :value="menu.name" :to="menu.path" :disabled="menu.disabled">{{
          menu.name }}</t-menu-item>

        <template #operations>
          <t-button variant="text" shape="square">
            <template #icon><t-icon name="search" /></template>
          </t-button>
          <t-button variant="text" shape="square">
            <template #icon><t-icon name="mail" /></template>
          </t-button>
          <t-button variant="text" shape="square" @click="() => { $router.push('/') }">
            <template #icon><t-icon name="home" /></template>
          </t-button>
          <t-button variant="text" shape="square" @click="() => { $router.push('/user') }">
            <template #icon><t-icon name="user" /></template>
          </t-button>
          <t-button variant="text" shape="square" @click="() => { $router.push('/login') }">
            <template #icon><t-icon name="login" /></template>
          </t-button>
          <t-button variant="text" shape="square" @click="() => { $router.push('/setting') }">
            <template #icon><t-icon name="setting" /></template>
          </t-button>
        </template>
      </t-head-menu>
    </t-header>
    <t-content class="content">
      <RouterView></RouterView>
    </t-content>
    <t-footer class="footer"> Copyright©2024-2025 starit.com All Rights Reserved粤ICP备2021129378号

    </t-footer>
  </t-layout>
</template>
<script setup lang="ts">
import { ref } from 'vue';
import { RouterView } from 'vue-router'



const menus = ref([
  { name: '首页', path: '/', disabled: false, },
  { name: '知识图谱', path: '/kg', disabled: false, },
  { name: '资源', path: '/resource', disabled: false, },
  { name: '待办', path: '/todo', disabled: false, },
  { name: '关于', path: '/about', disabled: true, },
])


</script>
<style lang='scss' scoped>
.content {
  background-color: #FFFFFF;
  min-height: 88vh;
}

.footer {
  text-align: center;
  // padding: 10px;
  background-color: #FFFFFF;

}
</style>